<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>1123vue</title>

	</head>
	<body>
	<div id="app">
		
		web：{{name}}， 排名：{{index}}，共有：{{num}}人
		<button v-on:click='changeName'>改变名称</button>
		
	</div>
	<script src="js/vue.js"></script>
	<script>
	
		
		var myvue=new Vue ({
			el: '#app',
			data: {
				name: '1906',
				index: 2,
				num: 22
			},
			//事件函数
			//TODO:这里不理解
			methods: {
				//改变name值
				changeName() {
					//获取name设置新值
					//this就是指当前的实例对象--vue实例
					this.name = '前端1906A';
					this.input();
				},
				input() {
					console.log('我是input事件')
				}
			}
		})
		console.log(myvue.name)
		
		
		
		
		
		
		
		
		
		
		
	</script>
	</body>
</html>
